<template>
	<view>
		<uni-file-picker :value="fileObj" limit="1" :del-icon="false" :disable-preview="true" file-mediatype="image"
			:imageStyles="imageStyles" @select="selectFile" :sourceType="sourceType">选择头像</uni-file-picker>
	</view>
</template>

<script>
	export default {
		name:"uploadAvatar",
		emits: ['success'],
		props: {
			url: {
				type: String,
				default: ''
			}
		},
		watch: {
			url: {
				handler(val) {
					if (val) {
						let names = val.split(".")
						let suffix = names[names.length - 1];
						this.fileObj = {
							name: '_file.' + suffix,
							extname: suffix,
							url: this.$util.showFile(val)
						}
					}
				},
				deep: true
			},
		},
		data() {
			return {
				imageStyles: {
					"height": 100, // 边框高度
					"width": 100, // 边框宽度
					"border": { // 如果为 Boolean 值，可以控制边框显示与否
						"color": "#dcdcdc", // 边框颜色
						"width": "2px", // 边框宽度
						"style": "solid", // 边框样式
						"radius": "50%" // 边框圆角，支持百分比
					}
				},
				fileObj: {},
				sourceType: ["album", "camera"]
			};
		},
		methods: {
			selectFile(e) {
				uni.showLoading({
					mask: true,
					title: '上传中...'
				})
				let filePath = e.tempFilePaths[0];
				this.$api.upload(filePath, 'image').then(res=>{
					uni.hideLoading();
					this.$emit('success', res.data);
				}).catch(err=>{
					uni.hideLoading();
				})
			}
		}
	}
</script>
